@import

    "../core/mixin",
    "../core/setting";

//主图层
#container {
    width: 100%;
    height: 100%;
}

//内容视图
.main-content {
    margin-left: $sidebar-width;
    min-width: 980px;
}

.main-content-sm {
    margin-left: $sidebar-sm-width;
}

.wrapper {
    display: inline-block;
    margin-top: $header-height;
    padding: $wrap-padding;
    width: 100%;
}

.ui-header,
.ui-sidebar {
    position: fixed;
    left: 0;
}

.ui-header {
    width: 100%;
    min-width: 1000px;
    z-index: 290;
    height: $header-height;
    line-height: $header-height;
    top: 0;
}

.ui-sidebar {
    height: 100%;
    width: $sidebar-width;
    overflow: hidden;
    z-index: 300;
    top: $header-height;
}

.ui-header h1{
    text-align: center;
    font-size: $font-size-h1;
}

.ui-header-stable,
.ui-header-positive{
    padding-left: 98px;
    box-sizing: border-box;
}

.ui-header-stable {
    background-color: $stable-bg;
}

.ui-header-positive {
    background-color: $positive-bg;
    color: #fff;
    a,a:active,i{
        color: #fff;
    }
}

.ui-sidebar-positive {
    background-color: $sidebar-bg;
    color: $positive-txt;
    a,a:active,i{
        color: $white;
    }
}

.ui-header ~ .ui-container {
  border-top: $header-height solid transparent;
}

//布局面板
.ui-panel {
    margin-bottom: $panel-margin-b;
    background-color: $white;
    border-radius: $borderRadiusBase;
}

.ui-panel-header {
    padding: $panel-padding-h $panel-padding-w;
    font-size: $baseFontSize + 3;
}

.ui-panel-body {
    padding: $panel-padding-w;

    &:after {
        clear: both;
        display: table;
        content: " ";
    }

    &:before {
        @extend :after;
    }
}

//垂直上下居中
.ui-center {
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    text-align: center;
    height: 150px;
}

// 排版
.ui-flex,
.ui-tiled{
    display: -webkit-box;
    width: 100%;
    -webkit-box-sizing: border-box;
}
.ui-flex-ver{
    -webkit-box-orient: vertical;
}
.ui-flex-pack-start {
    -webkit-box-pack: start;
}
.ui-flex-pack-end {
    -webkit-box-pack: end;
}
.ui-flex-pack-center {
    -webkit-box-pack: center;
}
.ui-flex-align-start {
    -webkit-box-align: start;
}
.ui-flex-align-end {
    -webkit-box-align: end;
}
.ui-flex-align-center {
    -webkit-box-align: center;
}
/**
 * 平铺
 */
.ui-tiled li {
    -webkit-box-flex: 1;
    width: 100%;
    text-align: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-pack: center;
    -webkit-box-align: center;
}
